<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="./css/font.css">
    <link rel="stylesheet" href="./css/xadmin.css">
    <script type="text/javascript" src="./js/jquery-2.1.0.js"></script>
    <script src="./lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="./js/Global.js"></script>
    <style>
        .wrap {
            padding: 20px;
            width: 100%;
            overflow: auto;
            box-sizing: border-box;
        }

        .select {
            height: 40px;
            padding: 20px 0;
            border-bottom: 1px solid #ccc;
            text-align: center;
        }

        .search {
            width: 200px;
            height: 38px;
            margin: 0 auto;
            display: inline-block;
            padding-top: 1px;

        }

        select {
            height: 36px;
            min-width: 80px;
        }

        .layui-input {
            border: 0;
            outline: none;
            text-align: center;
        }

        .btn {
            display: inline-block;

        }

        .next {
            text-align: center;
        }

        .layui-table td,
        .layui-table th {
            padding: 0;
            text-align: center;
            height: 30px;
            line-height: 30px;
            font-size: 12px;
        }

        .hanf {
            width: 49%;
        }

        .layui-input-block {
            margin-left: 0px;
            padding: 0 5px;
        }

        .control {
            min-width: 110px;
        }

        .num {
            min-width: 50px;
        }

        .top-nav {
            font-size: 14px;
            list-style: none;
            position: relative;
            display: none;
        }

        .top-nav li {
            float: left;
            list-style: none;
            margin-right: 1px;
        }

        .top-nav li a {
            height: 40px;
            line-height: 40px;
            text-decoration: none;
            background: #ccc;
            color: #666666;
            display: block;
            width: 200px;
            text-align: center;
        }

        .top-nav li a:hover {
            background: #666;
            color: #FFF;
        }

        .top-nav ul {
            list-style: none;
            display: none;
            width: 200px;
            padding: 0;
            position: relative;
        }

        .top-nav li ul {
            position: absolute;
            top: 0;
            left: 200px;
        }

        .dylist {
            display: none;
        }
    </style>
</head>

<body>
    <div class="wrap">
        <div class="layui-btn layui-btn-sm" onclick="add()">增加</div>
        <div class="layui-btn layui-btn-sm" onclick="showDy()">缔约用户</div>
        <table class="layui-table xylist">
            <thead>
                <tr>
                    <th style="width:40%;">协议名称</th>
                    <th>
                        协议号
                    </th>
                    <th>
                        录入人
                    </th>
                    <th>
                        录入时间
                    </th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody class="htlist">

            </tbody>
        </table>
        <table class="layui-table dylist">
            <thead>
                <tr>
                    <th style="width:5%;">序号</th>
                    <th style="width:40%;">协议名称</th>
                    <th style="width:10%;">协议号</th>
                    <th style="width:10%;">缔约客户</th>
                    <th style="width:10%;">录入人</th>
                    <th style="width:10%;">缔约时间</th>
                    <th style="width:15%;">操作</th>
                </tr>
            </thead>
            <tbody class="ht">

            </tbody>
        </table>

    </div>
</body>
<script>

    // $.ajax({
    //     url: `${API}//ErpContractCustomerCustomer/getContractCustomerById?contractId=1`,
    //     type: 'get',
    //     success: function (res) {
    //         console.log(res)
    //         let str = ''
    //         $.each(res.data.data, function (i) {
    //             let json = res.data.data[i]
    //             str += `<tr>
    //                 <td>${i + 1}</td>
    //                 <td>${json.contractName == null ? '' : json.contractName}</td>
    //                 <td>${json.contractCode == null ? '' : json.contractCode}</td>
    //                 <td>${json.customerName == null ? '' : json.customerName}</td>
    //                 <td>${json.inputPerson == null ? '' : json.inputPerson}</td>
    //                 <td>${json.contractingDate == null ? '' : json.contractingDate}</td>
    //             </tr>`
    //         })
    //         $('.ht').append(str)
    //     }
    // })
    function showDy() {
        $('.xylist').hide()
        $('.dylist').show()
    }
    $.ajax({
        url: `${API}/erpContract/getContractBycustIdList?custId=${loadUserInfo.customer.id}`,
        type: 'get',
        success: function (res) {
            let arr = res.data.reverse()
            let str = ''
            $.each(arr, function (i) {
                let json = arr[i]
                let txt = json.conText
                if(txt) {
                    if(txt.length > 30){
                        txt = txt.substring(0,25) + '...'
                    }
                } else {
                    txt = ''
                }
                str += `<tr>
                    <td title="${json.conText}">${txt}</td>
                    <td>${json.conCode == null ? '' : json.conCode}</td>
                    <td>${json.conInput == null ? '' : json.conInput}</td>
                    <td>${json.conDate == null ? '' : json.conDate}</td>
                    <td><div class="layui-btn layui-btn-xs" onclick="updateXy(${json.id})">修改</div><div class="layui-btn layui-btn-xs layui-btn-danger" onclick="deleteXy(${json.id})">删除</div></td>
                    </tr>`
                layui.use('laydate', function () {
                    var laydate = layui.laydate;
                    laydate.render({
                        elem: `.sj_${i}`
                    });
                })
            })
            $('.htlist').append(str)

        }
    })
    // 缔约用户
    $.ajax({
        url: `${API}/ErpContractCustomerCustomer/getContractCustomerBycontractIdList?contractId=${loadUserInfo.customer.id}`,
        type: 'get',
        success: function (res) {
            console.log(res)
            let arr = res.data
            let str = ''
            $.each(arr, function (i) {
                let json = arr[i]
                str += `<tr>
                    <td>${i + 1}</td>
                    <td><input type="text" class="layui-input" data-name="contractName" value="${json.contractName}"></td>
                    <td onclick="goUrl()"><input type="text" class="layui-input" data-name="contractCode" value="${json.contractCode}"></td>
                    <td><input type="text" class="layui-input" data-name="customerName" value="${json.customerName}"></td>
                    <td><input type="text" class="layui-input" data-name="inputPerson" value="${json.inputPerson}"></td>
                    <td><input type="text" class="layui-input" data-name="contractingDate" value="${json.date}"></td>
                    <td>
                        <div class="layui-btn layui-btn-xs ">修改</div>
                        <div class="layui-btn layui-btn-xs layui-btn-danger">删除</div>
                    </td>
                </tr>`
            })
            $('.ht').append(str)
        }
    })
    function deleteXy(id) {
        if (confirm('是否删除')) {
            $.ajax({
                url: ` ${API}/erpContract/removeContractById?contractId=${id}`,
                type: 'get',
                success: function (res) {
                    window.reload()
                }
            })
        }

    }
    // 修改
    function updateXy(id) {
        window.location.href = `./hetongxieyixiangqing.html?id=${id}`
    }
    // 新增
    function add() {
        window.location.href = './hetongxieyixinzeng.html'
    }


    let osCls
    //  查找大类
    function showLv1(show, cla) {
        osCls = cla
        $.ajax({
            url: `${API}/erpMaterielFlow/selectTop`,
            type: 'get',
            success: function (res) {
                let str = ''
                let arrs = res.data
                $.each(arrs, function (k, v) {
                    str +=
                        `<li onmouseenter="showLv2('${v.zid}',this)"  ><span class="names">${v.name}</span><div class="list-${v.zid} list-2"></div></li>`
                })
                $('.hover-show').html(str)
                if (show) {
                    $('.hover-show').show()
                }
            }
        })
    }
    // 查找品名
    function showLv2(zid, _this) {
        $(`.hover-show .list-2`).html('')
        aiZid = zid
        $.ajax({
            url: `${API}/erpMaterielFlow/selectTwo?pid=${zid}`,
            type: 'get',
            async: false,
            success: function (res) {
                let arr = res.data
                let str = '<ul>'
                $.each(arr, function (k, v) {
                    str +=
                        `<li onmouseenter="showLv3('${v.zid}',this)"  ><span class="names">${v.name}</span><div class="list-${v.zid} list-3"></div></li>`
                })
                str += '</ul>'
                $(_this).children('div').html(str)
            }
        })
    }
    // 查找规格
    function showLv3(zid, _this) {
        $(`.hover-show .list-3`).html('')
        $.ajax({
            url: `${API}/erpMaterielFlow/selectTwo?pid=${zid}`,
            type: 'get',
            async: false,
            success: function (res) {
                let arr = res.data
                let str = '<ul>'
                $.each(arr, function (k, v) {
                    str +=
                        `<li onmouseenter="showLv4('${zid}',this)"  ><span class="names">${v.name}</span><div class="list-${v.zid} list-4"></div></li>`
                })
                str += '</ul>'
                console.log(str)
                $(_this).children('div').html(str)
            }
        })
    }
    // 查找品牌
    function showLv4(zid, _this) {
        $(`.hover-show .list-4`).html('')
        $.ajax({
            url: `${API}/erpMaterielFlow/selectThree?pid=${zid}`,
            type: 'get',
            async: false,
            success: function (res) {
                let arr = res.data
                let str = '<ul>'
                $.each(arr, function (k, v) {
                    str +=
                        `<li onmouseenter="showLv5('${v.zid}',this)"  ><span class="names">${v.name}</span><div class="list-${v.zid} list-5"></div></li>`
                })
                str += '</ul>'
                $(_this).children('div').html(str)
            }
        })
    }
    // 查找型号
    function showLv5(zid, _this) {
        $(`.hover-show .list-5`).html('')
        $.ajax({
            url: `${API}/erpMaterielFlow/selectThree?pid=${zid}`,
            type: 'get',
            async: false,
            success: function (res) {
                let arr = res.data
                let str = '<ul>'
                $.each(arr, function (k, v) {
                    str +=
                        `<li onmouseenter="showLv6('${v.zid}',this)"  ><span class="names">${v.name}</span><div class="list-${v.zid} list-6"></div></li>`
                })
                str += '</ul>'
                $(_this).children('div').html(str)
            }
        })
    }

    function showLv6(zid, _this) {
        $(`.hover-show .list-6`).html('')
        $.ajax({
            url: `${API}/erpMaterielFlow/selectSytem?shu=51`,
            type: 'get',
            async: false,
            success: function (res) {
                console.log(res)
                let arr = res.data
                let str = '<ul>'
                $.each(arr, function (k, v) {
                    str +=
                        `<li onmouseenter="showLv7('',this)" ><span class="names">${v}</span><div class="list-7"></div></li>`
                })
                str += '</ul>'
                console.log(str)
                $(_this).children('div').html(str)
            }
        })
    }
    // 查找
    function showLv7(zid, _this) {
        $(`.hover-show .list-7`).html('')
        $.ajax({
            url: `${API}/erpMaterielFlow/selectSytem?shu=69`,
            type: 'get',
            async: false,
            success: function (res) {
                let arr = res.data
                let str = '<ul>'
                $.each(arr, function (k, v) {
                    str +=
                        `<li onmouseenter="showLv8('',this)" ><span class="names">${v}</span><div class="list-8"></div></li>`
                })
                str += '</ul>'
                $(_this).children('div').html(str)
            }
        })
    }

    function showLv8(zid, _this) {
        $(`.hover-show .list-8`).html('')
        $.ajax({
            url: `${API}/erpMaterielFlow/selectSytem?shu=27`,
            type: 'get',
            async: false,
            success: function (res) {
                let arr = res.data
                let str = '<ul>'
                $.each(arr, function (k, v) {
                    str += `<li onclick="setWlVal(this)" ><span class="names">${v}</span></li>`
                })
                str += '</ul>'
                $(_this).children('div').html(str)
            }
        })
    }
    $(document).on('click', function () {
        $('.hover-show').hide()
    })
    function setWlVal(_this) {
        $(`.${osCls} .materielUnit`).val($(_this).text())
        $(`.${osCls} .materielPlace`).val($(_this).parents('.list-8').prev().text())
        $(`.${osCls} .materielState`).val($(_this).parents('.list-7').prev().text())
        $(`.${osCls} .materielModel`).val($(_this).parents('.list-6').prev().text())
        $(`.${osCls} .materielBrand`).val($(_this).parents('.list-5').prev().text())
        $(`.${osCls} .materielSpecifications`).val($(_this).parents('.list-4').prev().text())
        $(`.${osCls} .materielName`).val($(_this).parents('.list-3').prev().text())
    }
</script>

</html>